//命名导入
import { getEle,getTime } from "../utils/utils.js";

//默认导入（不能重命名）
// import { getEle } from "../utils/utils.js";
import bindEvent from "../utils/bindEvent.js";

//获取元素
const addBtn =  getEle("#btn");
const list =  getEle(".list");
const del = getEle(".iconfont icon-delete");
let text = getEle("#text");
// let btn = document.getElementById("btn");

//绑定事件(事件流：事件捕获、事件冒泡)
addBtn.addEventListener("click",function() {
    //创建一个li元素
    const li = document.createElement("li");
    li.innerHTML = `<input type="checkbox" />
        <span>${text.value}</span>
        <time>${getTime(Date.now())}</time>
        <i class="iconfont icon-delete"></i>`;//模板字符串
    list.appendChild(li);
},false)//第三个参数是是否开启事件捕获

//删除功能（新增列表删不了）
// const deleteBtns = document.querySelectorAll(".list i");
// for(let i=0;i<deleteBtns.length;i++) {
//     deleteBtns[i].addEventListener("click",function() {
//         list.removeChild(this.parentNode)
//     },false)
// }

//事件委托(利用事件冒泡机制)
    // list.addEventListener("click",function(e){
    //     if(e.target.nodeName == "I") {
    //         list.removeChild(e.target.parentNode);
    //     }
    // })

    bindEvent(".list","click",function(e){
        if(e.target.nodeName == "I") {
            this.removeChild(e.target.parentNode);
        }
    });
    console.log(window);
